import  observe  from './observe';
import Dep from "./Dep"
export default function defineReactive(data, key, val) {
  // console.log('我是defineReactive', key)
  const dep = new Dep(); // // 每个属性对应一个Dep实例， 这是当前key对应的一个依赖集合。
  if (arguments.length === 2) { 
    val = data[key];
  }
  // 子元素进行observe观测, 至此形成了递归，这个递归不是函数自己调用自己，（而是多个函数、类循环调用）而是在defineReactive中创建了一个observe方法，并将observe传递给子元素，而observe方法内部递归进行observe处理。
  let childOb =  observe(val)
  Object.defineProperty(data, key, {
    // 可枚举
    enumerable: true,
    // 可以配置，可以使用delete删除
    configurable: true,
    // getter
    get () {
      console.log(`你访问了${key}属性`, this)
      if (Dep.target) {  // 在getter中收集依赖
        dep.depend();  // dep 在闭包里面 ？
        if (childOb) {
          childOb.dep.depend()
        }
      }
      return val;
    },
    // setter
    set (newVal) {
      console.log(`你改变了${key}属性`, newVal);   
      if (val === newVal) return 
      val = newVal;
      // 当设置了新值，这个新值也要被observe
      childOb = observe(newVal)
      // 发布订阅模式，通知dep  ，在setter触发依赖
      dep.notify()
    }
  })
}